<template>
  <div class="picSelect">
    <a-button type="primary" @click="show = true">
      上传图片
    </a-button>
    <a-modal
      title="上传图片"
      :visible="show"
      :width="800"
      @ok="show = false"
      @cancel="show = false"
      okText="确定" cancelText="取消"
    >
      <a-upload
        action="/api/uploadPic"
        list-type="picture-card"
        name="pic"
        :file-list="fileList"
        @change="uploadChange"
      >
        <div>
          <a-icon type="plus" />
          <div class="ant-upload-text">上传</div>
        </div>
      </a-upload>
    </a-modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      show:false,
      fileList:[]
    }
  },
  props:{
    pic:{
      type:Array,
      default:[]
    }
  },
  created() {
    this.fileList = this.pic
  },
  methods: {
    uploadChange({ fileList }){
      let pic = []
      for(let i of fileList){
        if(i.status == "done"){
          pic = fileList
        }
      }
      this.$emit("update:pic",pic)
      this.fileList = fileList
    }
  },
}
</script>

<style scoped>
  
</style>